$__AUI_DROPDOWN_MENU_SELECTOR: ".#{$aui-ns}-dropdown-menu";

$aui-zindex-dropdown: 1000;
$aui-dropdown-border-width: 1px;
$aui-dropdown-bg: #ffffff;
$aui-dropdown-border-color: $aui-brand-gray;

@mixin aui-dropdown-mixin-dropdown-menu() {
    z-index: $aui-zindex-dropdown;
    padding-left: 0;
    margin: 0;
    list-style: none;
    display: none; // none by default, but block on "open" of the menu
    padding: 0;        
    text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
    list-style: none;
    background: $aui-dropdown-bg;
    background-clip: padding-box;
    border: $aui-dropdown-border-width solid $aui-dropdown-border-color;
}

@mixin aui-dropdown-create-dropdown-menu($selector: $__AUI_DROPDOWN_MENU_SELECTOR) {
    #{$selector} {
        @include aui-dropdown-mixin-dropdown-menu();
    }
}

@mixin aui-dropdown-use-dropdown-menu-selector() {
    #{$__AUI_DROPDOWN_MENU_SELECTOR} {
        @content;
    }
}

@include aui-vue-register-component("dropdown-menu", (sel: $__AUI_DROPDOWN_MENU_SELECTOR));